<nz-layout  style="height: 100%;">
  <nz-sider  [(nzCollapsed)]="isCollapsed" [nzWidth]="200" style="box-shadow: 0 4px 6px rgba(1,1,1,0.5);z-index: 14;" [style.overflow-y]="isCollapsed?'':'auto' ">
    <div class="logo" [class.logoColl]="isCollapsed" style="overflow:hidden">
      <img src="../../assets/images/logo_new_color.png" alt="">
      <span>控制台</span>
    </div>
    <ul class="router-select" nz-menu [nzTheme]="'dark'" [nzMode]="'inline'" [nzInlineCollapsed]="isCollapsed">
      <ng-container *ngFor="let item of menu;let i = index;">
        <li nz-submenu *ngIf="!!item.children.length" [(nzOpen)]="item.expanded" (nzOpenChange)="expandChange(item.expanded, i)">
          <span title><i class="anticon" [ngClass]="item.icon"></i><span class="nav-text">{{item.title}}</span></span>
          <ul >
            <li *ngFor="let ite of item.children" [nzSelected]="false"  (click)="clearActive(ite.path)" nz-menu-item [routerLink]="ite.path == '/member/display' && this.addRouteUrl ? ite.path + this.addRouteUrl : '' || ite.path" [ngClass]="{'specialPath':activePath + addRouteUrl == ite.path + addRouteUrl }" routerLinkActive='active-link'>{{ite.title}}</li>
          </ul>
        </li>
        <li nz-menu-item *ngIf="!item.children.length">
          <span title><!--<i class="anticon anticon-user"></i>--><span class="nav-text">{{item.title}}</span></span>
        </li>
      </ng-container>
    </ul>
  </nz-sider>
  <nz-layout>
    <nz-header style="background: #fff; padding:0;position:fixed;width:100%;top:0;z-index:11;border-bottom: 1px solid #e9e9e9;    box-shadow: 0 0px 4px rgba(0,21,41,0.12);z-index: 13;">
      <div (mouseenter)="opendrop()" (mouseleave)="hidedrop()" class="ant-dropdown-trigger fr" style="margin-right:220px;cursor:pointer">
        <div style="width:24px;height:24px;display: inline-block;border-radius: 50%;overflow: hidden;margin-right: 10px;vertical-align: middle;">
          <img *ngIf="!head_img" style="width:100%;height:100%;vertical-align: top;" src="/assets/images/main-header-default.png" alt="" class="head_img">
          <img *ngIf="head_img" style="width:100%;height:100%;vertical-align: top;" [src]="AliyunOssOutputUrl+'/'+head_img" alt="" class="head_img">
        </div>
        <span class="head-name">{{hadLoginName}}</span>
      </div>

      <div (mouseenter)="opendrop()" (mouseleave)="hidedrop()" class="ant-dropdown-list" [style.display]="dropShow?'block':'none'">
        <ul><li (click)="clear()"><i class="anticon anticon-logout mr-10"></i>退出登陆</li></ul>
      </div>
      <i class="anticon" (click)="changeCol()"
        style="margin-left: 24px;font-weight: bold;font-size: 18px;cursor:pointer"
         [class.anticon-menu-unfold]="isCollapsed"
         [class.anticon-menu-fold]="!isCollapsed">
      </i>
      <nz-dropdown>
        <a class="ant-dropdown-link" nz-dropdown>
          当前店：{{shop.name}} <i class="anticon anticon-down"></i>
        </a>
        <ul nz-menu>
          <li nz-menu-item *ngFor="let item of shop_list " (click)="changeShop(item)">
            <span >{{item.name}}</span>
          </li>
        </ul>
      </nz-dropdown>
    </nz-header>
    <nz-content style="height: 100%;padding-top:63px;">
      <!--<nz-breadcrumb style="margin:16px 0;">-->
        <!--<nz-breadcrumb-item>一级菜单</nz-breadcrumb-item>-->
        <!--<nz-breadcrumb-item>二级菜单</nz-breadcrumb-item>-->
        <!--<nz-breadcrumb-item>三级菜单</nz-breadcrumb-item>-->
      <!--</nz-breadcrumb>-->
      <!-- <div>
        <router-outlet></router-outlet>
      </div> -->
      <router-outlet></router-outlet>
    </nz-content>
    <!--<nz-footer style="text-align: center;">Ant Design ©2017 Implement By Angular</nz-footer>-->
  </nz-layout>
</nz-layout>
